import { LaptopOutlined, NotificationOutlined, TableOutlined, UserOutlined } from '@ant-design/icons';
import { App, Avatar, Breadcrumb, Button, Layout, Menu } from 'antd';
import React, { useState } from 'react';
import './index.less';
import { useHistory } from 'react-router-dom'
import { Redirect, Route, Switch } from "react-router-dom";
import { ConfigProvider, theme } from "antd";
import managerContext from './managerContext';
import Czt from '../pages/Czt';
import Jzzy from '../pages/Jzzy';
import Xzqh from '../pages/Xzqh';
import Jcdjc from '../pages/Jcdjc';
import GuoHui from './imges/logo1.png'
import CztEdit from '../pages/CztHandle/CztEdit';
import CztLook from '../pages/CztHandle/CztLook';
import CztAdd from '../pages/CztHandle/CztAdd';
import JzzyEdit from '../pages/JzzyHandle/JzzyEdit';
import JzzyLook from '../pages/JzzyHandle/JzzyLook';
import JzzyAdd from '../pages/JzzyHandle/JzzyAdd';
import XzqhAdd from '../pages/XzqhHandle/XzqhAdd';
import XzqhEdit from '../pages/XzqhHandle/XzqhEdit';
import XzqhLook from '../pages/XzqhHandle/XzqhLook';
import JcdjcAdd from '../pages/JcdjcHandle/JcdjcAdd';
import JcdjcEdit from '../pages/JcdjcHandle/JcdjcEdit';
import JcdjcLook from '../pages/JcdjcHandle/JcdjcLook';
import Fxyhsjgl from '../pages/Fxyhsjgl';
import FxyhsjAdd from '../pages/FxyhsjglHandle/FxyhsjAdd';
import FxyhLook from '../pages/FxyhsjglHandle/FxyhLook';
import FxyhEdit from '../pages/FxyhsjglHandle/FxyhEdit';
import Fxpgbggl from '../pages/Fxpgbbgl';
import FxpgbbglAdd from '../pages/FxpgbbglHande/FxpgbbglAdd';
import FxpgbbglLook from '../pages/FxpgbbglHande/FxpgbbglLook';
import Jcsjxx from '../pages/Jcsjxx';
import JcdEdit from '../pages/JcdHandle/JcdEdit';
import JcdLook from '../pages/JcdHandle/JcdLook';
import JcdAdd from '../pages/JcdHandle/JcdAdd';
import Yjxxgl from '../pages/Yjxxgl';
import YjxxglLook from '../pages/YjxxglHandle/YjxxglLook';
import YjxxglEdit from '../pages/YjxxglHandle/YjxxglEdit';
import YjxxglAdd from '../pages/YjxxglHandle/YjxxglAdd';
import Wbzjsj from '../pages/Wbzjsj';
import WbzjsjLook from '../pages/WbzjsjHandle/WbzjsjLook';
import WbzjsjEdit from '../pages/WbzjsjHandle/WbzjsjEdit';
import WbzjsjAdd from '../pages/WbzjsjHandle/WbzjsjAdd';
import Zqzhpg from '../pages/Zqzhpg';
import Fxqhgl from '../pages/Fxqhgl';
import Yhqxgl from '../pages/Yhqxgl';
import SFXX from '../pages/ShenFenXinXi';
import NewJzzy from '../newPages/NewJzzy';
import Bu_men from '../pages/Bu_men';
import { useLocation } from 'react-router-dom/cjs/react-router-dom.min';
import NewCzt from '../newPages/NewCzt';
import FetchHelper from '../../../../utils/helper/fetch-helper';
import Xytj from '../newPages/Xytj';
import Xztj from '../newPages/Xztj';



const { Header, Content, Sider } = Layout;
export default function Manager(props) {

    const history = useHistory();
    const {
        token: { colorBgContainer },
    } = theme.useToken();

    const [looktype, setLooktype] = useState();


    const [isLoggingOut, setIsLoggingOut] = useState(false);

    const handleLogout = () => {
        setIsLoggingOut(true); // 设置为正在注销状态

        FetchHelper.postJson(`/admin-api/logout`)
            .then(response => {
                // 成功退出登录后刷新页面
                setTimeout(() => {
                    window.location.reload(); // 刷新当前页面
                }, 2000); // 演示2秒
            })
            .catch(error => {
                console.error('退出登录失败:', error);
                // 在实际应用中，你可能还需要处理退出登录失败的情况
            })
            .finally(() => {
                setIsLoggingOut(false); // 重置为未注销状态
            });
    }

    const [longitudeAndLatitude, setLongitudeAndLatitude] = useState();

    const pathname = useLocation().pathname;

    const subItems = [{
        key: 'czt',
        label: '承灾体'
    },
    //  {
    //     key: 'jzzy',
    //     label: '减灾资源'
    // }, 
    {
        key: 'jzzy_new',
        label: '减灾资源'
    }, {
        key: 'xzqh',
        label: '行政区划'
    }, {
        key: 'jcdjc',
        label: '监测点'
    }, {
        key: 'fxyhsjgl',
        label: '风险隐患管理'
    },
    {
        key: 'fxpgbggl',
        label: '灾害风险评估报告管理'
    }, {
        key: 'jcsjxxcd',
        label: '监测数据'
    },
    {
        key: 'jcyjpgjcxxgl',
        label: '监测预警评估基础信息管理',
        // onSelect:()=>{

        // },
        children: [
            {
                key: 'yjxxgl',
                label: '预警信息'
            },
            {
                key: 'wbzjsj',
                label: '专家数据'
            },
        ]

    },

    {
        key: 'yhqxgl',
        label: '用户权限'
    },
        // {
        //     key: 'sfxxgl',
        //     label: '个人信息'
        // },
        // {
        //     key: 'bmxx',
        //     label: '部门信息'
        // }
    ]

    const tjSubItems = [{
        key: 'xytj',
        label: '县域统计'
    }, {
        key: 'xztj',
        label: '乡镇统计'
    }]
    return <ConfigProvider theme={{
        algorithm: theme.darkAlgorithm,
        token: {
            colorPrimary: '#1E5363',
            colorBgContainer: '#0E1923',
            colorBgElevated: '#0E1923',
            colorTextBase: '#fff',
            colorPrimaryBg: '#64b7d0',
        }




    }}>
        <managerContext.Provider value={{
            looktype,
            setLooktype,
            longitudeAndLatitude,
            setLongitudeAndLatitude
        }}>
            <App>

                <Layout className='abs-0 manager-layout'>
                    <Header style={{
                        display: 'flex',
                        alignItems: 'center',
                        // backgroundColor:"white",
                        //background: '#1677ff',
                        color: "#fff",
                        fontSize: 24,
                        padding: '0 12px'
                        // color:"#fff"
                    }}>

                        <div className='layout-h center fill' style={{
                            justifyContent: 'space-between'
                        }}>
                            <div className='layout-h center'>
                                <img alt='guohui' src={GuoHui} style={{
                                    marginRight: 8,
                                    width: 45,
                                    height: 45,
                                    borderRadius: 50

                                }} />监测预警子系统</div>

                            <div className='layout-h center' style={{
                                fontSize: 18,
                                //cursor: 'pointer',

                            }} onClick={handleLogout}>
                                <Button style={{
                                    color: isLoggingOut ? 'red' : 'white', // 根据状态设置字体颜色
                                }}
                                    icon={<UserOutlined />}
                                >

                                    {/* <Avatar size={36} icon={<UserOutlined />} style={{
                                        marginRight: 8
                                    }} ></Avatar> */}
                                    退出登录
                                </Button>

                            </div>
                        </div>
                    </Header>

                    <Layout>
                        <Sider
                            width={300}
                        //collapsible
                        >
                            <Menu
                                // theme='dark'
                                mode="inline"
                                defaultSelectedKeys={['czt']}
                                defaultOpenKeys={['1']}
                                selectedKeys={[[...subItems, ...tjSubItems].find(item => {
                                    return pathname.indexOf(item.key) > -1
                                })?.key]}
                                style={{
                                    height: '100%',
                                    borderRight: 0,
                                }}
                                onClick={({ key }) => {
                                    history.push(`/manager/${key}`)
                                }}
                                items={[{
                                    key: 1,
                                    label: '数据管理',
                                    icon: <TableOutlined />,
                                    children: subItems
                                }, {
                                    key: 2,
                                    label: '统计指标',
                                    icon: <TableOutlined />,
                                    children: tjSubItems
                                }]}
                            />
                        </Sider>
                        <Layout
                            style={{
                                padding: 12,
                            }}
                        >
                            <Content >
                                <Switch>
                                    <Redirect exact path="/manager" to={"/manager/czt"}></Redirect>
                                    {/* <Redirect path="/home" to={"/main/home"}></Redirect> */}
                                    <Route path="/manager/czt" component={NewCzt}></Route>
                                    {/* <Route path="/manager/jzzy" component={Jzzy}></Route> */}
                                    <Route path="/manager/xzqh" component={Xzqh}></Route>
                                    <Route path="/manager/fxyhsjgl" component={Fxyhsjgl}></Route>
                                    <Route path="/manager/jcdjc" component={Jcdjc}></Route>
                                    <Route path="/manager/fxpgbggl" component={Fxpgbggl}></Route>
                                    <Route path="/manager/FxpgbbglAdd" component={FxpgbbglAdd}></Route>
                                    <Route path="/manager/FxpgbbglLook/:id" component={FxpgbbglLook}></Route>
                                    <Route path="/manager/cztEdit/:id" component={CztEdit}></Route>
                                    <Route path="/manager/cztLook/:id" component={CztLook}></Route>
                                    <Route path="/manager/cztAdd/:keyPath" component={CztAdd}></Route>
                                    <Route path="/manager/jzzyEdit/:id" component={JzzyEdit}></Route>
                                    <Route path="/manager/jzzyLook/:id" component={JzzyLook}></Route>
                                    <Route path="/manager/jzzyAdd/:keyPath" component={JzzyAdd}></Route>
                                    <Route path="/manager/xzqhAdd/" component={XzqhAdd}></Route>
                                    <Route path="/manager/xzqhEdit/:id" component={XzqhEdit}></Route>
                                    <Route path="/manager/xzqhLook/:id" component={XzqhLook}></Route>
                                    <Route path="/manager/jcdjcAdd" component={JcdjcAdd}></Route>
                                    <Route path="/manager/jcdjcEdit/:id" component={JcdjcEdit}></Route>
                                    <Route path="/manager/jcdjcLook/:id" component={JcdjcLook}></Route>
                                    <Route path="/manager/fxyhAdd/:keyPath" component={FxyhsjAdd}></Route>
                                    <Route path="/manager/fxyhLook/:id" component={FxyhLook}></Route>
                                    <Route path="/manager/fxyhEdit/:id" component={FxyhEdit}></Route>
                                    <Route path="/manager/jcsjxxcd" component={Jcsjxx}></Route>
                                    <Route path="/manager/jcdEdit/:id" component={JcdEdit}></Route>
                                    <Route path="/manager/jcdLook/:id" component={JcdLook}></Route>
                                    <Route path="/manager/jcdAdd/:keyPath" component={JcdAdd}></Route>
                                    <Route path="/manager/yjxxgl" component={Yjxxgl}></Route>
                                    <Route path="/manager/yjxxglLook/:id" component={YjxxglLook}></Route>
                                    <Route path="/manager/yjxxglEdit/:id" component={YjxxglEdit}></Route>
                                    <Route path="/manager/yjxxglAdd/:keyPath" component={YjxxglAdd}></Route>
                                    <Route path="/manager/wbzjsj" component={Wbzjsj}></Route>
                                    <Route path="/manager/wbzjsjLook/:id" component={WbzjsjLook}></Route>
                                    <Route path="/manager/wbzjsjEdit/:id" component={WbzjsjEdit}></Route>
                                    <Route path="/manager/wbzjsjAdd/:keyPath" component={WbzjsjAdd}></Route>
                                    <Route path="/manager/zqzhpg" component={Zqzhpg}></Route>
                                    <Route path="/manager/fxqygl" component={Fxqhgl}></Route>
                                    <Route path="/manager/yhqxgl" component={Yhqxgl}></Route>
                                    {/* <Route path="/manager/sfxxgl" component={SFXX}></Route>
                                        <Route path="/manager/bmxx" component={Bu_men}></Route> */}

                                    <Route path="/manager/jzzy_new" component={NewJzzy}></Route>
                                    <Route path="/manager/xytj" component={Xytj}></Route>
                                    <Route path="/manager/xztj" component={Xztj}></Route>
                                </Switch>

                            </Content>

                        </Layout>

                    </Layout>
                </Layout>
            </App>
        </managerContext.Provider>
    </ConfigProvider>;
}